<template>
  <div class="page">
         <router-view></router-view>
  </div>
</template>

<script>
export default {
    name:"dish_layout",
  data() {
    return {
      index: 0,
    };
  },
  computed: {
    classObject: function () {
      return {
        active: this.isActive && !this.error,
        "text-danger": this.error && this.error.type === "fatal",
      };
    },
  },
  methods: {
    showMenu(index) {
      this.index = index;
      if (index == 0) {
        this.$router.push({
          path: "/dish/home",
        });
      } else if (index == 1) {
        this.$router.push({
          path: "/dish/room",
        });
      } else {
        console.info("hi");
      }
    },
  },
};
</script>

<style scoped>
ul{
        width: 150px;

}
li {
  list-style: none;
  text-align: left;
  cursor: pointer;

  font-size: 14px;
  height: 36px;
  line-height: 36px;
  text-align: center;
}
.active {
  color: #2b7fc3;
  background: #eaf2f9;
}
.page {
  display: flex;
}
.page .left {
}
.page .content {
  flex-grow: 1;
}
.content{
    background-color: #fff;
}
</style>